<template>
	<el-dialog
		:title="titleMap[mode]"
		v-model="visible"
		:width="700"
		destroy-on-close
		append-to-body
		@closed="emits('closed')"
	>
		<el-form
			:model="form"
			:rules="rules"
			ref="dialogForm"
			label-width="80px"
			:style="'el-dialog' === 'el-drawer' ? 'padding:0 20px' : ''"
		>

<!--			<el-form-item label="系统用户ID" prop="sys_user_id">-->
<!--				<el-input v-model="form.sys_user_id" clearable placeholder="请输入系统用户ID"/>-->
<!--			</el-form-item>-->
			<el-form-item label="登录账号" prop="user_name">
				<el-input v-model="form.user_name" clearable placeholder="请输入登录账号"/>
			</el-form-item>
			<el-form-item label="登录密码" prop="password">
				<el-input v-model="form.password" clearable placeholder="请输入登录密码"/>
			</el-form-item>
			<el-form-item label="店铺名称" prop="title">
				<el-input v-model="form.title" clearable placeholder="请输入店铺名称"/>
			</el-form-item>

			<el-form-item label="店铺图片" prop="image">
				<sc-upload v-model="form.image" title="选择店铺图片" file-select/>
			</el-form-item>

			<el-form-item label="店铺logo" prop="logo">
				<sc-upload v-model="form.logo" title="选择店铺logo" file-select/>
			</el-form-item>

			<el-form-item label="联系人" prop="name">
				<el-input v-model="form.name" clearable placeholder="请输入联系人"/>
			</el-form-item>

			<el-form-item label="联系电话" prop="tel">
				<el-input v-model="form.tel" clearable placeholder="请输入联系电话"/>
			</el-form-item>

<!--			<el-form-item label="省" prop="province">-->
<!--				<el-input v-model="form.province" clearable placeholder="请输入省"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="市" prop="city">-->
<!--				<el-input v-model="form.city" clearable placeholder="请输入市"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="区" prop="area">-->
<!--				<el-input v-model="form.area" clearable placeholder="请输入区"/>-->
<!--			</el-form-item>-->

			<el-form-item label="详细地址" prop="address">
				<city-linkage v-model="form.address" valueType="name"/>
			</el-form-item>

			<el-form-item label="完整地址" prop="old_address">
				<el-input v-model="form.old_address" clearable placeholder="请输入完整地址"/>
			</el-form-item>

			<el-form-item label="身份证号" prop="id_card">
				<el-input v-model="form.id_card" clearable placeholder="请输入身份证号"/>
			</el-form-item>

			<el-form-item label="身份证正面" prop="id_card_a">
				<sc-upload v-model="form.id_card_a" title="选择身份证正面" file-select/>
			</el-form-item>

			<el-form-item label="身份证反面" prop="id_card_b">
				<sc-upload v-model="form.id_card_b" title="选择身份证反面" file-select/>
			</el-form-item>

			<el-form-item label="营业执照" prop="license">
				<sc-upload v-model="form.license" title="选择营业执照" file-select/>
			</el-form-item>

			<el-form-item label="店铺视频" prop="video">
				<sc-upload
					v-model="form.video"
					title="上传店铺视频"
					type="file"
					@success="handlerUploadFileVideo"
				/>
			</el-form-item>

			<el-form-item label="审核状态 " prop="status">
				<el-select v-model="form.status" style="width:100%" clearable placeholder="请选择审核状态 ">

					<el-option
						v-for="(item, index) in dictData.merchant_status"
						:key="index" :label="item.label"
						:value="item.value"
					>{{ item.label }}
					</el-option>

				</el-select>
			</el-form-item>

<!--			<el-form-item label="拒绝原因" prop="error_msg">-->
<!--				<el-input v-model="form.error_msg" clearable placeholder="请输入拒绝原因"/>-->
<!--			</el-form-item>-->

			<el-form-item label="显示 " prop="status">
				<el-switch v-model="form.status" :active-value="proxy.$CONFIG.SWITCH.ENABLE"
									 :inactive-value="proxy.$CONFIG.SWITCH.DISABLE"/>
			</el-form-item>

			<el-form-item label="商家类型" prop="type">
				<el-select v-model="form.type" style="width:100%" clearable placeholder="请选择商家类型">

					<el-option
						v-for="(item, index) in dictData.server_type"
						:key="index" :label="item.label"
						:value="item.value"
					>{{ item.label }}
					</el-option>

				</el-select>
			</el-form-item>

<!--			<el-form-item label="纬度" prop="lat">-->
<!--				<el-input v-model="form.lat" clearable placeholder="请输入纬度"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="经度" prop="log">-->
<!--				<el-input v-model="form.log" clearable placeholder="请输入经度"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="服务评分" prop="service_score">-->
<!--				<el-input v-model="form.service_score" clearable placeholder="请输入服务评分"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="商品评分" prop="goods_score">-->
<!--				<el-input v-model="form.goods_score" clearable placeholder="请输入商品评分"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="售后评分" prop="sales_score">-->
<!--				<el-input v-model="form.sales_score" clearable placeholder="请输入售后评分"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="收藏数" prop="keep">-->
<!--				<el-input v-model="form.keep" clearable placeholder="请输入收藏数"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="评论数" prop="comment">-->
<!--				<el-input v-model="form.comment" clearable placeholder="请输入评论数"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="商品总分" prop="goods_score_all">-->
<!--				<el-input v-model="form.goods_score_all" clearable placeholder="请输入商品总分"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="服务总分" prop="service_score_all">-->
<!--				<el-input v-model="form.service_score_all" clearable placeholder="请输入服务总分"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="商家编号" prop="number">-->
<!--				<el-input v-model="form.number" clearable placeholder="请输入商家编号"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="认证" prop="identification">-->
<!--				<el-input v-model="form.identification" clearable placeholder="请输入认证"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="支付金额" prop="money">-->
<!--				<el-input v-model="form.money" clearable placeholder="请输入支付金额"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="真实支付金额" prop="pay_money">-->
<!--				<el-input v-model="form.pay_money" clearable placeholder="请输入真实支付金额"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="支付方式" prop="pay_type">-->
<!--				<el-input v-model="form.pay_type" clearable placeholder="请输入支付方式"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="支付状态" prop="pay_status">-->
<!--				<el-input v-model="form.pay_status" clearable placeholder="请输入支付状态"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="签名" prop="signPath">-->
<!--				<el-input v-model="form.signPath" clearable placeholder="请输入签名"/>-->
<!--			</el-form-item>-->

			<el-form-item label="权重排序" prop="weight">
				<el-input v-model="form.weight" clearable placeholder="请输入权重排序"/>
			</el-form-item>

<!--			<el-form-item label="商家手续费" prop="charge">-->
<!--				<el-input v-model="form.charge" clearable placeholder="请输入商家手续费"/>-->
<!--			</el-form-item>-->

<!--			<el-form-item label="支付时间" prop="pay_time">-->
<!--				<el-date-picker-->
<!--					v-model="form.pay_time" placeholder="请选择支付时间"-->
<!--					type="datetimerange" start-placeholder="起始时间" end-placeholder="结束时间"-->
<!--				/>-->
<!--			</el-form-item>-->
			<el-form-item label="提供的服务" prop="service">
				<el-input v-model="form.service" clearable placeholder="请输入提供的服务"/>
			</el-form-item>
			<el-form-item label="店铺说明" prop="desc">
				<editor v-model="form.desc" placeholder="请输入店铺说明" :height="400"/>
			</el-form-item>

			<el-form-item label="过期时间" prop="expire_time">
				<el-date-picker
					v-model="form.expire_time" placeholder="请选择过期时间"
					type="datetime" start-placeholder="起始时间" end-placeholder="结束时间"
				/>
			</el-form-item>

		</el-form>
		<template #footer>
			<el-button @click="visible = false">取 消</el-button>
			<el-button type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
		</template>
	</el-dialog>
</template>

<script setup>
import {ref, reactive, defineExpose, onMounted, getCurrentInstance} from 'vue'
import {useRouter} from "vue-router";
import {ElMessage} from 'element-plus'
import commonMerchant from '@/api/apis/common/commonMerchant'
import systemDict from '@/api/apis/system/dataDict'
import editor from '@/components/scEditor'
import cityLinkage from '@/components/maCityLinkage'
import threeLevelLinkage from '@/components/maCityLinkage/threeLevelLinkage'


const emits = defineEmits(['success', 'closed'])
const {proxy} = getCurrentInstance();
const router = useRouter();

const mode = ref('add')
const treeList = ref([])
const visible = ref(false)
const isSaveing = ref(false)
const dialogForm = ref(null)

const titleMap = reactive({add: '新增商家', edit: '编辑商家'})
const dictData = reactive({
	merchant_status: [],
	server_type: [],

})
const form = reactive({
	id: '0',
	sys_user_id: '0',
	user_id: '0',
	title: '',
	video: '',
	image: '',
	desc: '',
	logo: '',
	name: '',
	tel: '',
	province: '',
	city: '',
	area: '',
	address: [],
	old_address: '',
	service: '',
	id_card: '',
	id_card_a: '',
	id_card_b: '',
	license: '',
	status: '2',
	error_msg: '',
	is_show: proxy.$CONFIG.SWITCH.ENABLE,
	type: '1',
	lat: '',
	log: '',
	service_score: '0',
	goods_score: '0',
	sales_score: '0',
	keep: '0',
	comment: '0',
	goods_score_all: '0',
	service_score_all: '0',
	number: '0',
	identification: '',
	money: '',
	pay_money: '',
	pay_type: '0',
	pay_status: '0',
	signPath: '',
	weight: '0',
	charge: '',
	pay_time: null,
	expire_time: null,
	user_name: '',
	password: '',

})
const rules = reactive({
	title: [{required: true, message: '店铺名称必填', trigger: 'blur'}],
	user_name: [{required: true, message: '登录账号必填', trigger: 'blur'}],
	password: [{required: true, message: '登录密码必填', trigger: 'blur'}],
	// image: [{required: true, message: '店铺图片必填', trigger: 'blur'}],
	// name: [{required: true, message: '联系人必填', trigger: 'blur'}],
	// tel: [{required: true, message: '联系电话必填', trigger: 'blur'}],
	// address: [{required: true, message: '详细地址必填', trigger: 'blur'}],
	// old_address: [{required: true, message: '完整地址必填', trigger: 'blur'}],
	// id_card: [{required: true, message: '身份证号必填', trigger: 'blur'}],
	// id_card_a: [{required: true, message: '身份证正面必填', trigger: 'blur'}],
	// id_card_b: [{required: true, message: '身份证反面必填', trigger: 'blur'}],
	// license: [{required: true, message: '营业执照必填', trigger: 'blur'}],

})

onMounted(async () => {
	await getDictData()
	if (router.currentRoute.value.query.open) {
		open('add');
	}
})

const getDictData = () => {
	systemDict.getDict('merchant_status').then(res => {
		dictData.merchant_status = res.data
	})
	systemDict.getDict('server_type').then(res => {
		dictData.server_type = res.data
	})

}

const open = (type = 'add') => {
	mode.value = type
	visible.value = true

}

const submit = () => {
	dialogForm.value.validate(async (valid) => {
		if (valid) {
			isSaveing.value = true
			const res = mode.value === 'add' ? await commonMerchant.save(form) : await commonMerchant.update(form.id, form)
			if (res.success) {
				emits('success', form, mode.value)
				visible.value = false
				ElMessage.success(res.message)
			} else {
				ElMessage.error(res.message)
			}
			isSaveing.value = false
		}
	})
}

const setData = (data) => {
	for (let k in form) {
		if (data[k] || data[k] === 0) {
			form[k] = data[k]
		}
	}
}


const handlerUploadFileVideo = (res) => {
	if (res.success) {
		form.video = res.url
	}
}
defineExpose({
	open, setData
})
</script>
